<template>
	<view class="page_content">
		<u-navbar title="订单列表" :autoBack="true" :bgColor="theme_color" :titleStyle="{color:'#ffffff'}"
			leftIconColor="#ffffff"></u-navbar>
		<view class="content_box" :style="'margin-top:' + navH + 'px;'">
			<view class="acea-row" style="justify-content: center;">
				<u-tabs :list="listType" lineWidth="50" :lineColor="theme_color" @change="tabChange"
					:current="currentTab" :activeStyle="{ color: theme_color,}"></u-tabs>
			</view>
			<view class="bg-white padding20">
				<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback">
					<view v-for="(item,index) in allList" :key="index"
						style="box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.08);border-radius: 8px;margin-bottom: 10px;border: 1px solid rgba(0,0,0,0.08);"
						class="padding10">
						<view class="acea-row row-between">
							<view class="flex">
								<view class="fs-14">店铺:</view>
								<view v-if="item.supplier_info != null && item.is_selfsale == 0"
									style="padding-left: 10upx;" class="color333 fw-bolder fs-14">
									{{item.supplier_info.supplier_name}}
								</view>
								<view style="padding-left: 10upx;" class="color333 fw-bolder" v-else>
									{{item.dianpu_name}}
								</view>
							</view>
							<view style="color: orangered;">
								{{item.status_desc || ''}}
							</view>
						</view>

						<view style="padding-top: 10px;">
							<view v-for="(value,jndex) in item.goods_info" :key="jndex" @click="toDetail(item,value)"
								v-if="item.is_selfsale == 0">
								<view class="acea-row row-between" style="margin-bottom: 8upx;">
									<view>
										<image :src="value.goods_thumb" style="width: 100px;height: 100px;"></image>
									</view>
									<view style="padding-left:10px;flex: 1;">
										<view class="fw-bolder color000 line1 fs-14">
											{{value.goods_name}}
										</view>
										<view style="padding-top: 10px;text-align: right;">
											￥{{value.goods_price}}
										</view>
										<view style="padding-top: 10px;text-align: right;"
											v-if="value.old_unit_price !=null ">
										</view>
										<view style="padding-top: 10px;text-align: right;">
											{{value.goods_attr || ''}}
										</view>
										<view style="text-align: right;padding-top: 10px;">
											x {{parseInt(value.goods_number)}}
										</view>
									</view>
								</view>
							</view>

							<view v-for="(value,jndex) in item.goods_info" :key="jndex" @click="toDetail(item,value)"
								v-if="item.is_selfsale == 1">
								<view class="acea-row row-between" style="margin-bottom: 8upx;">
									<view>
										<image :src="value.goods_img" style="width: 100px;height: 100px;"></image>
									</view>
									<view style="padding-left:10px;">
										<view class="fw-bolder color000 line1">
											{{value.goods_name}}
										</view>
										<view style="padding-top: 10px;text-align: right;">
											￥{{value.goods_price}}
										</view>
										<view style="text-align: right;padding-top: 10px;">
											x {{parseInt(value.goods_number)}}
										</view>
									</view>
								</view>
							</view>

						</view>

						<view>
							<view style="text-align: right;" class="fs-14">
								<text v-if="item.is_selfsale == 0">共{{item.total_num}}商品,实付款:</text><text
									class="color333 fs-14 fw-bolder">￥{{item.order_amount}}</text>
								<text v-if="item.is_selfsale == 0"
									v-bind:class="{txt_1:parseInt(item.shipping_fee) != 0 }">(含运费￥{{item.shipping_fee}})</text>
							</view>
							<view class="acea-row row-between fs-14" style="padding-top: 10px;">
								<view style="color:darkgoldenrod;font-size: 15px;font-weight: bolder;">
									<block v-if="item.extension_code == 'discount_goods'">折旧商品</block>
									<block v-if="item.extension_code == 'group_buy'">团购商品</block>
									<block v-if="item.extension_code == 'exchange_goods'">积分兑换商品</block>
									<block v-if="item.extension_code == 'day_rent'">日租商品</block>
									<block v-if="item.extension_code == 'month_goods'">月租商品</block>
									<block v-if="item.extension_code == 'year_goods'">年租商品</block>
								</view>
								<view v-if="item.pay_name != ''">
									付款方式：{{item.pay_name}}
								</view>
							</view>
						</view>
						<view v-if="item.extension_code == 'pre_sale'"
							style="padding: 10px 0;justify-content: flex-end;" class="flex">
							<view style="width: fit-content;">
								<u-tag text="预售活动"></u-tag>
							</view>
						</view>

						<view class="acea-row row-between padding10">
							<u-button text="查看详情" :plain="true" shape="circle"
								:customStyle="{width:'100px',height:'30px'}"
								@click="offlineOrderDetailsNavigateTo(item)"></u-button>

							<u-button text="支付" type="error" :plain="true" shape="circle"
								:customStyle="{width:'100px',height:'30px'}"
								v-if="item.status_btn.pay &&item.status_btn.pay == true"
								@click="payMoney(index)"></u-button>

							<u-button text="支付尾款" type="error" :plain="true" shape="circle"
								:customStyle="{width:'100px',height:'30px'}" :disabled="item.pre_sale_pay_outdate"
								v-if="item.extension_code == 'pre_sale' && parseInt(item.money_paid) != item.order_amount"
								@click="payMoney(index)"></u-button>
						</view>

						<u-alert v-if="item.extension_code == 'pre_sale'" fontSize="12"
							:title="'支付时间段:'+ item.act_info.ext_info.retainage_start + '~' +item.act_info.ext_info.retainage_end"
							type="warning"></u-alert>
					</view>
				</mescroll-body>
			</view>
		</view>

		<u-modal :show="yue_pay_modal" @confirm="yueConfirmPay" ref="uModal" :asyncClose="true" @cancel="yueCancel"
			:showCancelButton="true">
			<view>
				<view style="padding: 20px;text-align: center;font-weight: bold;font-size: 20px;">余额支付密码</view>
				<u--input border="surround" type="number" password maxlength="6" clearable v-model="yuePassword"
					placeholder="请输入六位纯数字密码"></u--input>
			</view>
		</u-modal>

	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import {
		order_list,
		cancel_order,
		refund_order,
		confirm_received,
		del_order
	} from '@/api/user'
	import {
		get_pay_code,
		third_epay_submit,
		epay_submit,
		surplus_pay,
		sale_self_order_list
	} from '@/api/store'
	import {
		mapGetters
	} from "vuex";
	import {
		BASE_URL
	} from '@/config/app';
	const common = require('@/mixins/common');
	var options = {};
	common(options);
	export default {
		mixins: [{
			methods: options
		}, MescrollMixin],
		data() {
			return {
				navH: '',
				theme_color: getApp().globalData.theme_color,

				listType: [{
					name: '全部',
				}, {
					name: '待付款',
				}, {
					name: '待发货'
				}, {
					name: '待收货',

				}, {
					name: '售后/退款'
				}],

				order_status: 1,

				currentTab: 0,
				supplier_id: '',
				order_index: 0,

				// 货单号
				order_sn: '',

				//全部订单列表
				allList: [],
				list_index: 0,

				//已完成页数
				page_pass_2: '1',
				ima_url: BASE_URL,
				order_id: '',

				yue_pay_index: 0,
				yue_pay_modal: false,
				yuePassword: '',

			}
		},
		computed: mapGetters(['isLogin', 'app_token']),
		onLoad(e) {
			this.navH = getApp().globalData.navHeight / 2;
			if (e.current != null) {
				this.currentTab = e.current;
				this.order_status = 1;
				this.mescroll.resetUpScroll()
			} else {
				this.order_status = 0;
			}
		},
		onShow() {
			this.canReset && this.mescroll.resetUpScroll()
			this.canReset && this.mescroll.scrollTo(0, 0)
			this.canReset = true
		},
		methods: {
			async upCallback(page) {
				var that = this;
				let res = []
				res = await that.getStoreOrderList(page)
				if (res.length) {
					res.forEach(function(item) {
						item.is_selfsale = 0
					})
				}
				let res1 = []
				res1 = await that.getSelfSaleOrderList(page)
				if (res1.length) {
					res1.forEach(function(item) {
						item.is_selfsale = 1
					})
				}
				let temp = []
				temp = res.concat(res1)
				this.mescroll.endSuccess(temp.length);
				if (page.num == 1) this.allList = [];
				this.allList = this.allList.concat(temp);
			},
			async getStoreOrderList(page) {
				var that = this;
				const {
					data
				} = await order_list({
					page: page.num,
					app_token: that.app_token,
					order_status: that.order_status,
					// order_type: 0, //0普通订单1分销订单
					supplier_id: getApp().globalData.supplier_id,
					// market_type: getApp().globalData.market
				})

				const timestamp = new Date().getTime();

				data.forEach(item => {
					if (item.extension_code == "pre_sale") {
						var date_start = new Date(item.act_info.ext_info
						.retainage_start); //传入一个时间格式，如果不传入就是获取现在的时间了，这样做不兼容火狐。
						
						var startTime = date_start.getTime();
						
						var date_end = new Date(item.act_info.ext_info
						.retainage_end); //传入一个时间格式，如果不传入就是获取现在的时间了，这样做不兼容火狐。

						var endTime = date_end.getTime();
						
						//支付时间过期后不能支付
						if (endTime > timestamp && startTime < timestamp) {
                             item.pre_sale_pay_outdate = false
						}else{
							item.pre_sale_pay_outdate = true
						}

					}
				})

				return data;
			},
			async getSelfSaleOrderList(page) {
				var that = this;
				const {
					data
				} = await sale_self_order_list({
					app_token: that.app_token,
					order_status: that.order_status,
					supplier_id: getApp().globalData.supplier_id,
					page: page.num,
					// market_type: getApp().globalData.market
				})
				return data;
			},

			toDetail(item, value) {
				if (item.is_selfsale) {
					uni.navigateTo({
						url: '/pages/shop_item/goods_detail/index?goods_id=' + value.goods_id
					})
				} else {
					uni.navigateTo({
						url: '/pages/goods/detail/index?goods_id=' + value.goods_id
					})
				}
			},
			tabChange(item) {
				var that = this;
				that.currentTab = item.index;
				if (that.currentTab == 0) {
					that.order_status = 0;
				} else if (that.currentTab == 1) {
					that.order_status = 1;
				} else if (that.currentTab == 2) {
					that.order_status = 3;
				} else if (that.currentTab == 3) {
					that.order_status = 4;
				} else if (that.currentTab == 4) {
					that.order_status = 5;
				}
				that.mescroll.resetUpScroll()
			},

			// 付款
			payMoney: function(index) {
				var _this = this;
				_this.order_sn = this.allList[index].order_sn;
				uni.showLoading({
					title: '请求中...'
				})

				wx.login({
					success(res) {
						var code = res.code;
						// 平台微信支付
						third_epay_submit({
							out_trade_no: _this.order_sn, //订单号
							title: '',
							type: 'wechat',
							method: 'miniapp',
							app_token: _this.app_token,
							code: code,
						}).then((res3) => {
							console.log('商家微信支付')
							console.log(res3);
							uni.hideLoading()
							var data = JSON.parse(res3.data);
							uni.requestPayment({
								provider: 'wxpay',
								timeStamp: data.timeStamp,
								nonceStr: data.nonceStr,
								package: data.package,
								signType: data.signType,
								paySign: data.paySign,
								success: function(res4) {
									console.log(res4)
									uni.showToast({
										title: '支付成功',
										duration: 2000
									})
									setTimeout(() => {
										_this.mescroll.resetUpScroll()
									}, 2000)
									_this.order_sn = ''
								},
								fail: function(err) {
									_this.order_sn = ''
									console.log(err)
									_this.mescroll.resetUpScroll()
								}
							});
						})
					}
				})

			},

			// 查看订单详情
			offlineOrderDetailsNavigateTo: function(item) {
				if (item.is_selfsale == 0) {
					uni.navigateTo({
						url: '../detail/index?order_id=' + item.order_id
					});
				} else {
					uni.navigateTo({
						url: '/pages/order/order_list_shop/detail/index?order_id=' + item.order_id
					});
				}
			},

			//余额支付
			yueConfirmPay() {
				var that = this;
				uni.showLoading({
					title: '支付中...'
				});
				surplus_pay({
					app_token: that.app_token,
					order_sn: that.order_sn,
					password: that.yuePassword
				}).then((res) => {
					uni.hideLoading();
					that.yuePassword = '';
					that.yue_pay_modal = false;
					if (res.status == 0) {
						that.list_pay.splice(that.yue_pay_index, 1);
						uni.showModal({
							content: res.msg,
							showCancel: false
						})
					} else {
						uni.showModal({
							content: res.msg,
							showCancel: false
						})
					}
				})
			},

			yueCancel() {
				this.yue_pay_modal = false;
				this.yuePassword = '';
			},
		},

	}
</script>

<style lang="scss" scoped>
</style>